<script>
export default {
  name: 'GoBack'
}
</script>
<script setup>
import router from '../router';
const props = defineProps({
  url: {
    type: String,
    default: '',
  },
  hasUrl: {
    type: String,
    default: true
  },
  title: {
    type: String,
    default: ''
  }
})
function goBack() {
  if (props.url === 'isReload') {
    window.location.href = '/';
  } else if (props.url !== '') {
    router.push(props.url)
  } else {
    router.back();
  }
}
</script>

<template>
  <div class="back-con">
    <div class="back" @click="goBack" v-if="hasUrl !== 'false'"></div>
    <div class="title">{{ title }}</div>
  </div>
</template>
<style scoped lang="scss">
.back-con {
  width: 100%;
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  position: relative;
  height: 44px;
  box-sizing: border-box;

  .back {
    width: 24px;
    height: 24px;
    cursor: pointer;
    background: url(../assets/images/al.png) no-repeat center;
    background-size: 100%;
    position: absolute;
    left: 10px;
    top: 10px;
  }

  .title {
    width: 100%;
    height: 100%;
    height: 44px;
    line-height: 44px;
    text-align: center;
    font-size: 18px;
    color: #ffffff;
  }
}
</style>